<template>
    <div class="banner banner-wraps">
      <div class="banner-text" v-for="(item,index) in condata" :key="index">
        <h5>{{ item.title }}</h5>
        <h3><numberScroll :value="item.num"></numberScroll><span v-if="index>0">+</span></h3>
        <p>{{ item.dis }}</p>
      </div>
    </div>
  </template>
  <script setup>
  defineProps({
    condata: Array
  })
  </script>
  <style>
  .banner {
    position: relative;
    height: 9.2rem;
    z-index: 2;
    background: url(/src/assets/img/about/banner.jpg) no-repeat;
    background-size: cover;
    display: flex;
    flex-wrap: wrap;
    padding: 2.5rem 0.5rem 1.5rem
  }
  
  .banner .banner-text {
    color: #fff;
    text-align: center;
    width: 50%;
    position: unset;
    margin-top: unset;
    transform: unset;
  }
  .banner .banner-text h5 {
    font-size: 0.24rem;
  }
  .banner .banner-text h3 {
    font-size: 0.62rem;
    font-weight: 400;
    margin-top: 0.14rem;
    letter-spacing: 0.02rem;
  }
  
  .banner .banner-text p {
    font-size: 0.22rem;
    font-family: Athene;
    font-weight: 400;
    letter-spacing: 0.05rem;
  }
  </style>
  